<template>
  <div class="app-container">
    <!-- 条件栏 -->
    <div class="filter-wrapper">
      <NewPageFilter
        v-model:query="filterInfo.query"
        :filter-list="filterInfo.list"
        :filter-btn="filterInfo.btn"
      >
        <template v-slot:filter-operateTime>
          <el-date-picker
            v-model="operateTime"
            format="YYYY-MM-DD"
            value-format="YYYY-MM-DD"
            type="daterange"
            range-separator="至"
            :clearable="false"
            :picker-options="$fn.pickerOptionsFn()"
            align="right"
            start-placeholder="操作时间开始日期"
            end-placeholder="操作时间结束日期"
            :shortcuts="$fn.pickerOptionsFn()"
            :default-time="[
              new Date(2000, 1, 1, 0, 0, 0),
              new Date(2000, 1, 1, 23, 59, 59),
            ]"
            @change="timeChange"
          ></el-date-picker>
        </template>
        <template v-slot:filter-maintenanceUserIdMutl>
          <el-input
            type="input"
            :disabled="true"
            class="not-mongolia"
            placeholder="请选择维修人员"
            v-model="maintenanceUserName"
          >
            <template #append>
              <el-icon @click="openRepairUserWindow"><MoreFilled /></el-icon>
            </template>
          </el-input>
        </template>
      </NewPageFilter>
    </div>
    <div class="filter-wrapper">
      <NewPageFilter :filter-btn="filterInfo.btnList"></NewPageFilter>
    </div>
    <!-- 表格 -->
    <TableContainer
      :refresh="tableInfo.refresh"
      :init-curpage="tableInfo.initCurpage"
      :pageTotal="pageInfos.pageTotal"
      :api="api"
      v-model:data="tableInfo.data"
      v-model:query="filterInfo.query"
      :tab-index="false"
      :field-list="tableInfo.fieldList"
      :handle="tableInfo.handle"
      summary="true"
      :summary-field-list="tableInfo.summaryFieldList"
      :pager="true"
      :checkBox="false"
    />
    <!-- 维修人员 -->
    <SelectRepairUser
      v-if="selectRepairUserInfo.visible"
      v-model:showDialog="selectRepairUserInfo.visible"
      :check-box="true"
      :saveEmpty="true"
      :highlight-row="true"
      :api="selectRepairUserInfo.api"
      :checkedList="selectRepairUserInfo.checkedList"
      :query="selectRepairUserInfo.query"
      @callback="selectRepairUserCallBack"
    />
  </div>
</template>

<script setup name="maintenanceHours">
import {
  pageTimeStatistics,
  excelTimeStatistics,
  printTimeStatistics,
  getMaintenanceGroupUserPage,
} from "@/api/repair";
import moment from 'moment'
import { fatchTemplateByCode } from "@/api/base";
const { proxy } = getCurrentInstance();

const operateTime = ref(['','']);
const pageInfos = ref({
  pageSize: 20,
  curPage: 1,
  pageTotal: 0,
});
const maintenanceUserName = ref("");
const api = ref("");
//选择维修人员
const selectRepairUserInfo = reactive({
  visible: false,
  saveEmpty: true,
  api: getMaintenanceGroupUserPage,
  query: {
    orgId: "",
    assetId: "",
    deptId: "",
    depotId: "",
    assetClassifyId: "",
    notAssetRepairType: "",
  },
  checkedRowList: []
});
// 过滤相关配置
const filterInfo = ref({
  query: {
    completeTime_from: '',
    completeTime_to: '',
    maintenanceUserIdMutl: "",
  },
  copyQuery: {},
  list: [
    {
      slot: true,
      label: "起止日期",
      value: "operateTime",
    },
    {
      slot: true,
      label: "维修人",
      value: "maintenanceUserIdMutl",
    },
  ],
  btn: [
    { type: "button", label: "搜索", event: search },
    { type: "button", label: "重置", event: clearSearch },
  ],
  btnList: [
    {
      type: "button",
      label: "导出excel",
      event: exportExcel,
      show: proxy.$permission("maintenanceHours:excel"),
    },
    {
      type: "button",
      label: "打印",
      event: print,
      show: proxy.$permission("maintenanceHours:print"),
    },
  ],
});
// 表格相关
const tableInfo = ref({
  refresh: 1,
  initCurpage: 1,
  data: [],
  fieldList: [
    { label: "维修人姓名", value: "maintenanceUserName" },
    { label: "维修人工号", value: "maintenanceUserNo" },
    { label: "维修组名称", value: "maintenanceGroupName" },
    { label: "维修工时(h)", value: "dealTimeAmount" },
    // { label: "完成时间", value: "completeTime" },
  ],
  summaryFieldList: [
    { value: 'dealTimeAmount', formatter: proxy.$fn.qtyFormatter },
  ],
});

onMounted(() => {
  filterInfo.value.copyQuery = proxy.$fn.deepClone(filterInfo.value.query);
  gettime()
  api.value = pageTimeStatistics
  getList()
});

function gettime() {
  const now = new Date()
  const nowYear = now.getFullYear()
  const nowMonth = now.getMonth()
  const first = moment(new Date(nowYear, nowMonth, 1, 0, 0)).format('YYYY-MM-DD')
  const second = moment().format('YYYY-MM-DD')

  filterInfo.value.query.completeTime_from = first
  filterInfo.value.query.completeTime_to = second
  operateTime.value[0] = first
  operateTime.value[1] = second
}

function exportExcelList() {
  let params = {
    ...filterInfo.value.query,
    curPage: pageInfos.value.curPage,
    pageSize: pageInfos.value.pageSize,
  };
  excelTimeStatistics(params).then((res) => {
    if (res) {
      proxy.$fn.parseExcel(res);
    }
  });
}

function openRepairUserWindow() {
  selectRepairUserInfo.visible = true;
}
function selectRepairUserCallBack(row) {
  if (row && row.length) {
    const userNames = []
    const userIds = []
    const ids = []
    row.forEach(item => {
      userIds.push(item.userId)
      ids.push(item.id)
      userNames.push(item.name)
    })
    filterInfo.value.query.maintenanceUserIdMutl = userIds.join(',')
    maintenanceUserName.value = userNames.join(',');
    selectRepairUserInfo.checkedList = ids
  } else {
    filterInfo.value.query.maintenanceUserIdMutl = "";
    maintenanceUserName.value = "";
    selectRepairUserInfo.checkedList = []
  }
}

// 获取列表
function getList() {
  tableInfo.value.refresh = Math.random();
}
function clearSearch() {
  filterInfo.value.query.maintenanceUserIdMutl = ''
  maintenanceUserName.value = "";
  gettime()
  getList()
}
//打印
function print() {
  fatchTemplateByCode({
    resourceCode: "maintenanceHours:print",
    isDefault: 1,
  }).then((res) => {
    if (res && res.success) {
      let temp = proxy.$fn.getPrintTemp(res.data[0]);
      getPrintData(temp);
    }
  });
}
function getPrintData(temp) {
  let queryParams = {
    curPage: pageInfos.value.curPage,
    pageSize: pageInfos.value.pageSize,
    ...filterInfo.value.query,
  }
  printTimeStatistics({queryParams: queryParams}).then((res) => {
    if (res.success && res) {
      let data = proxy.$fn.deepClone(res.data);
      let newData = data.map((item) => {
        return {
          ...item,
          ...item.orderInfo,
        };
      });
      proxy.$lodop.preview(temp, newData);
    }
  });
}
// 搜索
function search() {
  getList();
}
function timeChange(val) {
  if (val && val.length) {
    filterInfo.value.query.completeTime_from = val[0];
    filterInfo.value.query.completeTime_to = val[1];
  } else {
    filterInfo.value.query.completeTime_from = "";
    filterInfo.value.query.completeTime_to = "";
  }
  search();
}
function exportExcel() {
  exportExcelList();
}
</script>

<style scoped></style>
